
<template>
  <s-table
    class="h100"
    :columns="columns"
    :showPagination="false"
    :data="loadData"
    rowKey="id"
    ref="table"
    :scrollX="1150"
  >
    <template
      slot-scope="text"
      v-for="column in commonColumns"
      :slot="column.scopedSlots.customRender"
    >
      <table-ellipsis :text="text||'—'" :key="column.key"></table-ellipsis>
    </template>
  </s-table>
</template>
<script>
  import { relatedEcuTbColumns } from '../config/list'
  import TableEllipsis from '@/components/Ellipsis/TableEllipsis'
  import { STable } from '@/components'
  import { mapState } from 'vuex'
  export default {
    props: {
      modelId: {
        type: String,
        default: ''
      }
    },
    components: {
      TableEllipsis,
      STable
    },
    computed: {
      ...mapState({
        instantUpdateTime: (state) => state.app.instantUpdateTime
      }),
      commonColumns () {
        return relatedEcuTbColumns.filter(item => !item.special)
      }
    },
    data () {
      return {
        columns: relatedEcuTbColumns
      }
    },
    watch: {
      instantUpdateTime: {
        handler () {
          this.refreshData(true)
        },
        immediate: true
      }
    },
    methods: {
      loadData (parameter) {
        const vm = this
        // 如果是全部则不传值给后端
        const JnqueryParam = {}
        JnqueryParam.modelId = vm.modelId
        return vm.$api.getModelEcuConfig(vm.modelId)
      },
      refreshData (bool = false) {
        this.$refs.table && this.$refs.table.refresh(bool)
      }
    }
  }
</script>
<style lang="less" scoped></style>
